<template>
    <div>
        <el-dialog :destroy-on-close="true"
                   title="修改密码"
                   :close-on-click-modal="false"
                   @close="closeDialog"
                   :visible="visible"
                   width="400px">
            <el-form ref="formRef" :model="form" :rules="rules"  label-width="120px" >

            <el-form-item label="用户名"  prop="userName">
                <el-input v-model="form.userName" disabled :readonly="true" ></el-input>
            </el-form-item>

            <el-form-item label="登录名"  prop="loginName">
                <el-input v-model="form.loginName" disabled :readonly="true"></el-input>
            </el-form-item>

            <el-form-item label="原密码"  prop="loginPwd">
                <el-input v-model="form.loginPwd"></el-input>
            </el-form-item>

            <el-form-item label="新密码"  prop="newPwd">
                <el-input v-model="form.newPwd"></el-input>
            </el-form-item>

            <el-form-item label="确认密码"  prop="confirmPwd">
                <el-input v-model="form.confirmPwd"></el-input>
            </el-form-item>


            <el-row style="text-align: right">
                <el-form-item>
                    <el-button type="primary" @click="submitForm()">提交</el-button>
                    <el-button @click="closeDialog" >取消</el-button>
                </el-form-item>
            </el-row>

        </el-form>
        </el-dialog>
    </div>
</template>

<script>
    export default {
        components: {
        },
        props: ['visible'],
        data() {
            return {
                form: {
                    loginPwd:'',
                    newPwd:'',
                    confirmPwd:'',
                },
                rules: {
                    loginPwd: [
                        { required: true, message: '请输入数据', trigger: 'blur' },
                        { min: 2, max: 64, message: '长度在 2 到 64 个字符', trigger: 'blur' }
                    ],
                    newPwd: [
                        { required: true, message: '请输入数据', trigger: 'blur' },
                        { min: 6, max: 12, message: '密码长度6-12位', trigger: 'blur' }
                    ],
                    confirmPwd: [
                        { required: true, validator:this.validatorPwd, trigger: 'blur' },
                        { min: 6, max: 12, message: '密码长度6-12位', trigger: 'blur' }
                    ],
                },
            }
        },
        created() {

        },
        mounted() {

        },
        methods: {
            validatorPwd(rule, value, callback){
                let _this=this;
                if (value!==_this.form.newPwd){
                    callback(new Error("两次密码不一致，请重新输入！"));
                }else {
                    callback();
                }
            },

            closeDialog() {
                console.log(this.form)
                this.$emit('update:visible',false);
                //Object.assign(this.$data, this.$options.data());
            },

            submitForm(){
                let _this=this;
                let url='/user/updatePwd';
                console.log(url);
                this.$utils.submitFormData(_this,_this.$refs.formRef,url,_this.form,function (valid) {
                    console.log(valid);
                    return valid;
                },function () {
                    _this.closeDialog();
                    //_this.$emit('loadData', true);
                    _this.$router.push({path: '/login'});
                });
            },

            loadData(){
                let _this=this;
                setTimeout(function(){
                    _this.$http.post('/user/getCurrentUser').then(function(res){
                        if(res.data.success){
                            _this.form=res.data.data;
                        }else{
                            _this.$message.error('操作失败！错误编码:'+res.data.code+'错误原因:'+res.data.msg);
                        }
                    },function(){
                        _this.$message.error('操作失败！');
                    });
                }, 100);
            },
        },

        filters: {

        },
        watch:{

        }
    }

</script>
